<include file="public@header" />
<link rel="stylesheet" href="__STATIC__/css/zTree_v3/zTreeStyle/zTreeStyle.css" type="text/css">
<style>
    body {
        background-color: white;
        margin: 0;
        padding: 0;
        text-align: center;
    }

    div, p, table, th, td {
        list-style: none;
        margin: 0;
        padding: 0;
        color: #333;
        font-size: 13px;
        font-family: dotum, Verdana, Arial, Helvetica, AppleGothic, sans-serif;
    }
    #testIframe {
        margin-left: 10px;
    }
    .expander{margin-left: -20px;}
    .action_ul{overflow:hidden; font-size:16px; font-family:'黑体'; margin:10px 0px;}
    .action_ul li{padding:0px 10px; display:inline;text-align:center; float:left; cursor:pointer}
    .action_ul li img{margin:5px 0; width: 18px}
    .action_ul li p{margin: 0 0 5px;}
    .visua_div{border:2px solid #E3EEF4; white-space: nowrap;overflow-x: auto;}
    .visua_child{position:relative;display: inline-block;width:155px; height:160px; border-radius:10px; margin:3px; text-align:center; padding:15px 0 10px 0; vertical-align: text-top;}
    .visua_child input{margin: 0 2px; background:#fff}
    .visua_child p{margin: 0 0 3px; width: 100%;height: auto;white-space:normal;overflow: hidden;}

    .borderRight{border-right:2px solid #ccc}
    .bg_qianlv{background-color:#E9FEC0;}
    .bg_huanglv{background-color:#808000;}
    .bg_lan{background-color:#8080FF;}
    .bg_cheng{background-color:#F7E1CC;}
    .bg_hui{background-color:#E6E6E6;}
    .bg_lv{background-color:#00CC00;}
    .bg_huang{background-color:#F3D776;}
    .bg_red{background-color:#FF6699;}
    .bg_mei{background-color:#E792E0;}
    .bg_blue{background-color:#33CCFF;}
    .gege{width:15px; height:15px; float:left; margin:0 3px}
    .visua_child img{position:absolute; margin-top:-15px; left:85%; width:15px; height:15px}

</style>
<script type="text/javascript" src="__STATIC__/js/zTree_v3/jquery.ztree.core.js?3"></script>
<script type="text/javascript" src="__STATIC__/js/layer/layer.js"></script>
<SCRIPT type="text/javascript">
    var setting = {
        view: {
            dblClickExpand: false,
            showLine: true,
            selectedMulti: false
        },
        data: {
            simpleData: {
                enable: true,
                idKey: "id",
                pIdKey: "pId",
                rootPId: ""
            }
        },
        callback: {
            beforeClick: function (treeId, treeNode) {
                var zTree = $.fn.zTree.getZTreeObj("tree");
                if (treeNode.isParent) {
                    zTree.expandNode(treeNode);
                    return false;
                } else {
                    var id = treeNode.id;
                    var _pro_id="{$pro_id}";
                    $.ajax({
                        url		: "{:url('tombareacol')}",
                        type	: "post",
                        dataType: "json",
                        data	: {'id':id,'Ajax': 1},
                        success : function(result){
                            if(result.data.length == 0){
                                $(".visua_div").html('');
                                return;
                            }
                            var html="";
                            $.each(result.data, function(i, n){
                                if (n.cate_id==4){
                                    $('.deposit').css("display","block");
                                } else {
                                    $('.deposit').css("display","none");
                                }
                                $.each(n.col, function(y, m){
                                    var _disabled='';
                                    switch (m.col_status) {
                                        case 1:html+="<div class='visua_child bg_blue'>";break;
                                        case 2:html+="<div class='visua_child bg_cheng'>"; _disabled = '';break;
                                        case 3:html+="<div class='visua_child bg_lv'>";break;
                                        case 4:html+="<div class='visua_child bg_qianlv'>";break;
                                        case 5:html+="<div class='visua_child bg_huang'>";break;
                                        case 6:html+="<div class='visua_child bg_mei'>";break;
                                        case 7:html+="<div class='visua_child bg_red'>";break;
                                        case 8:html+="<div class='visua_child bg_hui'>";break;
                                        default:html+="<div class='visua_child bg_huanglv'>";break;
                                    }
                                    if (m.col_status !=0) {
                                        _disabled='disabled';
                                    }else {
                                        if (_pro_id != m.new_pro){
                                            _disabled='disabled';
                                        }
                                    }
                                    var order_id = '';
                                    if (m.order_id){
                                        order_id = m.order_id;
                                    }
                                    if(m.reacher != '' && m.reacher != null){

                                        if(m.login_id != 1){
                                            html+="<img src='__TMPL__/Public/assets/images/peo.png' name='diding' title='抵顶人姓名:"+m.reacher+"'/>";
                                        }else{
                                            html+="<div style='position: absolute; right: 5%;top: 1%; color: #13227a;' name='diding'>"+m.reacher+"</div><p></p>";
                                        }
                                        html+="<p><input type='checkbox' name='no[]' class='mw_num' data-pro_id='"+_pro_id+"'   data-new_pro='"+m.new_pro+"' data-old_pro='"+m.old_pro+"'   "+_disabled+" value='"+m.colID+"' data-msg='"+n.cate_id+"'>"+m.num+"</p>";
                                    }else {
                                        html+="<p><input type='checkbox' name='no[]' class='mw_num'  "+_disabled+" value='"+m.colID+"' data-pro_id='"+_pro_id+"'  data-new_pro='"+m.new_pro+"' data-old_pro='"+m.old_pro+"' data-order_id='"+order_id+"' data-msg='"+n.cate_id+"'>"+m.num+"</p>";
                                    }
                                    if(m.tomb_regulation == 1){
                                        html+="<p>单穴</p>";
                                    }else if(m.tomb_regulation == 2){
                                        html+="<p>双穴</p>";
                                    }else if(m.tomb_regulation == 3){
                                        html+="<p>三穴</p>";
                                    }
                                    if (m.selling_price) {
                                        html += "<p>单价:" + m.selling_price + "</p>";
                                    }
                                    if (m.shoppingguide) {
                                        html+="<p>业务员:"+m.shoppingguide+"</p>";
                                    }
                                    if (m.deceased_name) {
                                        // html+="<p>逝者:"+m.deceased_name+"</p>";
                                    }
                                    if (m.contract_sn) {
                                        html+="<p  >合同:"+m.contract_sn+"</p>";
                                    }

                                    html  +="</div>";

                                })
                                html+="<br />";
                            })
                            $(".visua_div").html(html);

                        },
                        error	: function(){
                            alert("服务器内部错误，请联系系统管理员");
                        }
                    });
                    return true;
                }
            },
        }
    };
    $(document).ready(function () {
        var t = $("#tree");
        var categorys = JSON.parse($("#categorys").html());
        console.log(categorys);
        t = $.fn.zTree.init(t, setting, categorys);
        var zTree = $.fn.zTree.getZTreeObj("tree");
        zTree.selectNode(zTree.getNodeByParam("id", 0));
    });

    $(document).on("click", ".mw_num", function () {
        var pro_id = $(this).data('pro_id'),
            purchase_id = "{$purchase_id}",
            new_pro = $(this).data('new_pro'),
            mw_id = $(this).val();
        if (pro_id== new_pro){

        }else {
            layer.alert("产品不匹配，请前墓位可视化中进行匹配产品", {icon: 5, yes: function (index) {
                    $('input[type=checkbox]').attr('checked',false)
                    layer.close(index);
                }
            })
        }
    })
    $(document).on("click","#sale",function(){
        var pro_id = $(this).data('pro_id');
        console.log(pro_id)
        var name = $("input[name='no[]']:checked");
        <!--没有子级时触发事件-->
        if(name.length < 1 ) {
            alert("请选择墓位！");
        }else{
            var tombar_id = '', order_id='',flag = false;
            $.each($("input[name='no[]']:checked"), function (i, n) {
                tombar_id =  $(this).val();
                order_id =  $(this).attr('data-order_id');
            });
            if(flag){
                return;
            }
            var url  = $(this).data('href') +'?tomb_id='+ tombar_id +'&order_id='+order_id;
            console.log(url)
            $(this).attr("href",url);
        }
    })


    $(document).on('click','#pipei',function () {
        var pro_id = "{$pro_id}",
            purchase_id = "{$purchase_id}";
        var name = $("input[name='no[]']:checked");
        <!--没有子级时触发事件-->
        if(name.length < 1 ) {
            layer.alert('请选择需要匹配的墓位！', {icon: 5})
        }else {
            var tombar_id = '', flag = false;
            $.each($("input[name='no[]']:checked"), function (i, n) {
                if (length == (i + 1)) {
                    tombar_id = tombar_id + $(this).val();
                } else {
                    tombar_id = tombar_id + $(this).val() + ',';
                }
            });

            layer.confirm('确认要匹配出库吗', {
                icon: 3, title: "提示", btn: ['确定', '暂不']
                , btn1: function () {
                    $.post("{:url('')}", {
                        purchase_id: purchase_id,
                        pro_id: pro_id,
                        mw_id: tombar_id
                    }, function (result) {
                        if (result.code == 1) {
                            $(this).parent().removeClass('bg_huanglv').addClass('bg_blue')
                            layer.alert(result.msg, {
                                icon: 1, yes: function (index) {
                                    $('input[type=checkbox]').attr('checked', false)
                                    layer.close(index);
                                    window.location.href = result.url;
                                }
                            })
                        } else {
                            layer.alert(result.msg, {
                                icon: 5, yes: function (index) {
                                    $('input[type=checkbox]').attr('checked', false)
                                    layer.close(index);
                                }
                            })
                        }
                    }, 'json');
                }, btn2: function () {
                    $('input[type=checkbox]').attr('checked', false)
                    layer.closeAll();
                }
            })
        }
    })

    //全选
    function selectAll(){
        var name = document.getElementsByName("no[]");
        for(var i=0;i<name.length;i++){
            name[i].checked=true;
        }
    }
    //全不
    function selectNone(){
        var name = document.getElementsByName("no[]");
        for(var i=0;i<name.length;i++){
            name[i].checked=false;
        }
    }
    //反选
    function selectInvert(){
        var name = document.getElementsByName("no[]");
        for(var i=0;i<name.length;i++){
            if(name[i].checked)
                name[i].checked=false ;
            else
                name[i].checked=true ;
        }
    }
</SCRIPT>
</head>

<body>
<div style="display: none" id="categorys">
    {$categorys}
</div>
<form class="js-ajax-form" action="{:url('RockOrder/outbound')}" method="get">
<table border=0 style="align-items: left;">
    <tr>
        <td width=15% align=left valign=top style="BORDER-RIGHT: #999999 1px dashed; padding-bottom: 2%">
            <div style="padding-top: 6%">
                <input type="text" style=" width:80%; margin-bottom:5px;" class="form-control"
                       name="name" value="{$name}" placeholder="按照墓位编号搜索"/>
                <ul id="tree" class="ztree" style="width:260px; overflow:auto;"></ul>
            </div>
        </td>
        <td width=95% align=left valign=top>
            <div style="width:80%; float:left;">
                <div style=" overflow:hidden; background:#F7F7F7; padding:5px 10px">
                    <div class="bg_qianlv gege"></div><span style="float:left">无规划</span>
                    <div class="bg_huanglv gege"></div><span style="float:left">无产品</span>
                    <div class="bg_blue gege"></div><span style="float:left">空闲</span>
                    <div class="bg_cheng gege"></div><span style="float:left">已认购</span>
                    <div class="bg_lv gege"></div><span style="float:left">定金</span>
                    <div class="bg_huang gege"></div><span style="float:left">购买未使用</span>
                    <div class="bg_mei gege"></div><span style="float:left">部分安葬</span>
                    <div class="bg_red gege"></div><span style="float:left">全部安葬</span>
                    <div class=" bg_hui gege"></div><span style="float:left">迁出</span>
                </div>
                <ul class="action_ul">

                    <li class="borderRight">
                        <a href="javascript:location.reload();">
                            <img src="__TMPL__/Public/assets/images/shuaxin.png">
                            <p>刷新</p>
                        </a>
                    </li>
                    <li class="borderRight">
                        <p style=" margin-top: 10px;">
                            <a class="btn" onClick="selectAll()">全选</a>
                            <a class="btn" onClick="selectNone()">全不选</a>
                            <a class="btn" onClick="selectInvert()">反选</a>
                        </p>
                    </li>
                    <li>
                        <a id="pipei" data-pro_id="{$pro_id}" data-msg="确定要匹配产品吗？"
                           data-href="{:url('tombCancelMerge')}">
                            <img src="__TMPL__/Public/assets/images/quxiaohebing.png">
                            <p>产品匹配出库</p>
                        </a>
                    </li>
                    <li>
                        <!--                        <a id="sale" data-href="{:url('sale')}" data-pro_id="{$pro_id}">-->
                        <!--                            <img src="__TMPL__/Public/assets/images/ico_msg_s.png">-->
                        <!--                            <p>销售</p>-->
                        <!--                        </a>-->
                    </li>
                </ul>
                <div class="visua_div"></div>
            </div>
        </td>
    </tr>
</table>
</form>
</body>
</html>


